<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>JQuery Selector 1</title>
		<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
		<script type="text/javascript">
			$(document).ready(function(){
				// ID 选择器, #开头, 返回一个元素
				$('#div1').css('color', 'blue');
			
				// 元素选择器, 元素tag名称, 返回多个元素
				$('div').css('color', 'maroon');
				// $('div').length == $('div').size();
				for(var i = 0; i < $('div').length; i++) {
					// 元素索引从0开始
					$('div').eq(1).css('font-weight', 'bold');
				}
				
				// class选择器, .开头, 返回多个元素
				$('.myDiv').css('color', 'red');
				// 判断元素是否存在
				if($('.myDiv').length > 0) { //判断元素包含数量即可
					$('.myDiv').css('color', 'red');
				}
				// 等价于if($('.myDiv').get(0)){} 或 if($('.myDiv')[0]){}
			});	
		</script>
		</head>
	<body>
		<div id="div1">Test Selector 1</div>
		<div id="div2" class="myDiv">Test Selector 2</div>
	</body>
</html>